export default {
  // ids of the items that should be currently displayed based on
  // current list type and current pagination
  // 当前活跃的id列表，依赖lists[activeType]/itemsPerPage/itemsPerPage/state.route.params.page的状态
  // 这些状态发生变化，那么当前getter也会响应式发生变化
  activeIds (state) {
    const { activeType, itemsPerPage, lists } = state

    if (!activeType) {
      return []
    }
    // 看这个state.route.params.page，就是用vuex-router-sync插件同步了stoire和router之后的效果
    // 可以获取到当前活跃路由的参数，这里就是获取当前页码
    const page = Number(state.route.params.page) || 1
    const start = (page - 1) * itemsPerPage
    const end = page * itemsPerPage

    return lists[activeType].slice(start, end)
  },

  // items that should be currently displayed.
  // this Array may not be fully fetched.
  // activeItems这个getter依赖于getters.activeIds和state.items这两个状态
  activeItems (state, getters) {
    return getters.activeIds.map(id => state.items[id]).filter(_ => _)
  }
}
